.rg-city-picker
  display: flex
  flex-direction: column
  .rg-search-bar
    margin: 10px
    display: flex
    align-items: center
    .rg-search-input
      display: flex
      align-items: center
      background-color: #f5f5f5
      border-radius: 5rem
      flex-grow: 1
      margin-right: 10px
      svg
        margin: 0 10px
        color: #aaa
      input
        display: block
        margin: 0 !important
        border: 0
        width: 100%
        font-size: 14px
        line-height: 1.42
        padding: 6px 6px 6px 0
        vertical-align: middle
        box-sizing: border-box
        outline: none !important
        border-radius: 2px
        background-color: transparent
  .rg-picker
    display: flex
    flex-direction: column
    width: 400px
    max-height: 340px
    overflow-y: auto
    padding: 0 10px 10px 10px
    row-gap: 1rem
    .rg-picker__province
      .rg-picker__title
        font-size: 18px
        margin-bottom: .3rem
        color: #ccc
      .rg-picker__body
        gap: .4rem 1rem
        display: flex
        flex-wrap: wrap
        .rg-picker__city
          font-size: 14px
          color: #666
          cursor: pointer
          &.selected
            color: black
            font-weight: 600
